<div>
    <div class="jumbotron">
        <h2>Project Octopus</h2>
    </div>
    <!--div class="row">
        <h2>BAna<span><utk-label lbl-type="warning" lbl-text="unstable"></utk-label></span></h2>
    </div-->
    <div class="container">
        <div utk-panel pnl-type="danger">
            <div utk-panel-header>Error</div>
            <div utk-panel-body>
                <div ng-repeat="r in list">
                    <div>{{r.error}}</div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-4 col-lg-2 col-sm-6" ng-repeat="r in list" style="padding-top: 5px">
            <utk-flip flp-id="{{$index}}" style="margin:auto" flp-trigger="hover">
                <utk-flip-front flp-type="{{r.FrontType}}">
                    <div style="line-height: 150px; font-size: 130%">{{r.description}}</div>
                    <div style="font-size: 100%; line-height: 50px">{{r.ago}}</div>
                </utk-flip-front>
                <utk-flip-back flp-type="{{r.BackType}}">
                    <div style="line-height: 200px; font-size: 200%">{{r.displayStatus}}</div>
                </utk-flip-back>
            </utk-flip>
        </div>
    </div>
</div>